<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
   <head>
      <title>floatz - Layouting Navigation Sample</title>
      <meta http-equiv="content-type" content="text/html; CHARSET=utf-8" />
      <meta http-equiv="content-script-type" content="text/javascript" />
      <meta http-equiv="content-style-type" content="text/css" />
      <meta http-equiv="content-language" content="en" />
      <meta name="author" content="" />
      <meta name="robots" content="index,follow" />
      <meta name="description" content="" />
      <link rel="stylesheet" type="text/css" href="styles/project6.css" />
      <script type="text/javascript" src="styles/floatz-1.1.2/scripts/jquery-1.7.2.min.js"></script>
      <script type="text/javascript" src="styles/floatz-1.1.2/scripts/floatz.js"></script>
      <script type="text/javascript" src="scripts/project.js"></script>
   </head>
   <body>
      <!-- page -->
      <div id="flz_page">
         <!-- header -->
         <div class="flz_box header">
            <ul class="flz_listnav flz_topnav">
               <li class="flz_selected"><a href="#" title="Goto Homepage">Home</a> |</li>
               <li><a href="#" title="Goto Sitemap">Sitemap</a> |</li>
               <li><a href="#" title="Goto Contact">Contact</a></li>
            </ul>
            Header
         </div>
         <!-- menu -->
         <div class="flz_box flz_hmenu menu">
            <ul>
               <li class="flz_selected"><a href="#" title="Goto Menu 1">Menu 1</a></li>
               <li><a href="#" title="Goto Menu 2">Menu 2</a></li>
               <li><a href="#" title="Goto Menu 3">Menu 3</a></li>
               <li><a href="#" title="Goto Menu 4">Menu 4</a></li>
            </ul>
         </div>
         <!-- submenu -->
         <div class="flz_box flz_l20 flz_vmenu submenu">
            <ul>
               <li class="flz_selected"><a href="#" title="Goto Menu 1">Menu 1</a>
                  <ul>
                     <li><a href="#" title="Goto Menu 11">Menu 11</a>
                        <ul>
                           <li><a href="#" title="Goto Menu 111">Menu 111</a>
                              <ul>
                                 <li><a href="#" title="Goto Menu 1111">Menu 1111</a>
                                    <ul>
                                       <li><a href="#" title="Goto Menu 11111">Menu 11111</a></li>
                                       <li><a href="#" title="Goto Menu 11112">Menu 11112</a></li>
                                       <li><a href="#" title="Goto Menu 11113">Menu 11113</a></li>
                                    </ul>
                                 </li>
                                 <li><a href="#" title="Goto Menu 1112">Menu 1112</a></li>
                                 <li><a href="#" title="Goto Menu 1113">Menu 1113</a></li>
                              </ul>
                           </li>
                           <li><a href="#" title="Goto Menu 112">Menu 112</a></li>
                           <li><a href="#" title="Goto Menu 113">Menu 113</a></li>
                        </ul>
                     </li>
                     <li><a href="#" title="Goto Menu 12">Menu 12</a></li>
                     <li><a href="#" title="Goto Menu 13">Menu 13</a></li>
                  </ul>
               </li>
               <li><a href="#" title="Goto Menu 2">Menu 2</a></li>
               <li><a href="#" title="Goto Menu 3">Menu 3</a></li>
               <li><a href="#" title="Goto Menu 4">Menu 4</a></li>
            </ul>
         </div>
         <!-- content -->
         <div class="flz_box flz_r80 flz_relative content">
            <ul class="flz_listnav flz_toolbar">
               <li><a href="#"><img src="images/print.gif" alt="" title="Print page" /></a></li>
               <li><a href="#"><img src="images/favorite.gif" alt="" title="Add to favorites" /></a></li>
               <li><a href="#"><img src="images/mail.gif" alt="" title="Tell a friend" /></a></li>
            </ul>
            <ul class="flz_listnav flz_breadcrumb">
               <li><a href="#" title="Goto Homepage">Home</a> &gt;</li>
               <li class="flz_selected"><a href="#" title="Goto Menu 1">Menu 1</a></li>
            </ul>
            <div class="flz_spacer">
               <h1>Content</h1>
               <p>
                  Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
               </p>
               <div class="flz_box">
                  <div class="flz_htabmenu">
                     <ul>
                        <li class="flz_selected"><a href="#" title="Goto Tab 1">Tab 1</a></li>
                        <li><a href="#" title="Goto Tab 2">Tab 2</a></li>
                        <li><a href="#" title="Goto Tab 3">Tab 3</a></li>
                     </ul>
                  </div>
                  <div class="flz_box">
                     <p>
                        Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
                     </p>
                     <div class="flz_box">
                        <div class="flz_box">
                           <p>
                              Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
                           </p>
                        </div>
                        <div class="flz_box">
                           <div class="flz_htabmenu_bottom">
                              <ul>
                                 <li class="flz_selected"><a href="#" title="Goto Tab 1">Subtab 1</a></li>
                                 <li><a href="#" title="Goto Tab 2">Subtab 2</a></li>
                                 <li><a href="#" title="Goto Tab 3">Subtab 3</a></li>
                              </ul>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
         </div>
         <!-- footer -->
         <div class="flz_box flz_r100 footer">
            Footer
         </div>
      </div>
   </body>
</html>
